<template lang="jade">

  div.return-bar
    i.iconfont(@click="back()") &#xe668;
    好友列表
  div.user-center.detail_top
    div.searchinput.cbox.nopos.mb10

      div.clx.input1
        input.kw( type="text", v-model="kw",placeholder="输入好友姓名或手机查找")
        //dl.cbox.ptype.ftype(v-show="!show_kw")
          dd(v-bind:class="{ 'on': f_type == '1'}",v-on:click="setView('1')") 邀请好友列表
          dd(v-bind:class="{ 'on': f_type == '2'}",v-on:click="setView('2')") 推荐好友列表

        //input(v-model="kw", type="text",placeholder="输入好友姓名或手机查找")

      div.clx
        //i.iconfont.zoome(@click="search()") &#xe62b;
        button(@click="search()") 查找


    ul.firend-invite-list(v-show=" f_type=='1' ", v-infinite-scroll="down()"  )
      li(v-for=" (index,item) in items " )
        //i.iconfont &#xe643;
        span {{item.realname}} {{item.phone}}
        strong 注册时间:{{item.regtime}}
        dl.cbox
          dd
            b {{item.tender}}
            em 投资总额(元)
          dd
            b {{item.reward}}
            em 投资奖励(元)


    ul.firend-list(v-show=" f_type=='2' ", v-scroll="down()",scroll-foot="100" )
      li(v-for=" (index,item) in items " )
        
        div.clearfix.title
          span {{item.phone}}
          b {{index+1}}

        div.clearfix.reg
          strong 注册时间:{{item.birthday}}
          b 是否开通华兴银行账户:{{item.bank_AcStation}}

        div 投资总额(元)：
          em {{item.tender}}

</template>

<script>
import '../../assets/sass/user/index.scss'
import {c_friends_list, Api_Friend_List} from '../../config/api'

export default {

  data () {
    return {
      info: {},
      show_kw:true,
      subview:"first",
      kw:"",
      f_type:'1',
      items:[],
      page:1,
      busy:true
    }
  },


  methods: {
    setView(key){
      this.f_type = key;
      this.items = [];
      if(key=='1')
        this.flist(1);
      else
        this.fetch(1);
    },
    back(){
      window.history.back();
    },


    search(){
      /*if(this.show_kw == false){
        this.show_kw = true;
        return;
      }*/
      //if(this.kw =="") return;
      this.items = [];
      if(this.f_type=='1')
        this.flist(1);
      else
        this.fetch(1);
    },
    down: function() {
      if(this.busy == true || this.items == ''){
        return false;
      } 
      this.busy = true;
      this.fetch(++this.page);
    },

    fetch: function (page) {
      var data = {'page': page}
      this.$http({url: c_friends_list+'&number=10&page='+page+'&kw='+this.kw, method: 'GET'}).then(function (response) {


        var obj = response.data;
        if(!obj.status){
          alert(obj.msg)
          if(obj.code == '10055'){
            sessionStorage.removeItem("login"); 
            this.$route.router.go('/login?from='+this.$route.path.substring(1))
          }
          return;
        }

        var result = response.data.data
        this.items = this.items.concat(result.list);
        this.busy = false;
        this.show_kw = false;


      });
    },

    flist: function (page) {
      var data = {'page': page}
      this.$http({url: c_friends_list+'&page='+page+'&name='+this.kw, method: 'GET'}).then(function (response) {


        var obj = response.data;
        if(!obj.status){
          alert(obj.msg)
          if(obj.code == '10055'){
            sessionStorage.removeItem("login"); 
            this.$route.router.go('/login?from='+this.$route.path.substring(1))
          }
          return;
        }

        var result = response.data.data.list
        this.items = this.items.concat(result);
        this.busy = false;
        this.show_kw = false;
      });
    }
  },
  route: {
    activate ( transition ) {
        this.flist(1);
        transition.next();
    }
  }
}
</script>